<template>
  <div id="app">
    <div>
      <br />
      <form class="form-inline">
        <label for="name">&nbsp;{{$t('yonghuming')}}</label>
        <input
          type="text"
          class="form-control"
          onkeyup="this.value=this.value.replace(/^ +| +$/g,'')"
          id="usnameval"
          :placeholder="$t('com_qsryhm')"
        />
        <label for="name" style=" display: none">&nbsp;{{$t('use_danwei')}}:</label>
        <input
          type="text"
          style=" display: none"
          class="form-control"
          id="citySel"
          readonly="readonly"
          :placeholder="$t('use_danwei')"
        />
        <button type="button" class="btn btn-primary">{{$t('chaxun')}}</button>
        <button
          type="button"
          class="btn btn-success"
          id="add"
          data-toggle="modal"
          data-target="#myModal"
        >{{$t('xinzeng')}}</button>
        <button type="button" class="btn btn-warning" id="deleUser">{{$t('shanchu')}}</button>

        <!--<button type="button" class="btn btn-primary"  >{{$t('dev_sblx1_ds')}}</button>
        <button type="button" class="btn btn-primary" id="add"  data-toggle="modal" data-target="#myModal">{{$t('guanbi')}}</button>!-->
        <button
          type="button"
          class="btn btn-success"
          id="update"
          style="display:none"
          data-toggle="modal"
          data-target="#myModal"
        >{{$t('xinzeng')}}</button>
      </form>
    </div>

    <div>
      <div
        id="menuContent"
        class="menuContent"
        style="display:none;z-index:1; position: absolute;width:196px"
      >
        <!--<ul id="treeDemo" class="ztree" style="margin-top:0; width:195px; height: 300px;"></ul>-->
        <loading></loading>
      </div>
      <div
        id="menuContenttow"
        class="menuContent"
        style="display:none;z-index:100000; position: absolute;width:468px"
      >
        <!--<ul id="treeDemo" class="ztree" style="margin-top:0; width:195px; height: 300px;"></ul>-->
        <loadingtow></loadingtow>
      </div>
    </div>
    <br />
    <div class="col-md-12" style="padding-right:0px;padding-left:0px;">
      <div class="panel panel-primary">
        <div class="panel-heading">
          <h3 class="panel-title" style="margin-left: 500px;">{{$t('use_yonghulb')}}</h3>
        </div>
        <div class="panel-body" style="height:100%;padding:0px;">
          <div class="jqGrid_wrapper">
            <table id="table_list_1"></table>
            <div id="pager_list_1"></div>
          </div>
        </div>
      </div>
    </div>
    <!-- 模态框（Modal） -->
    <div>
      <div
        class="modal fade"
        id="myModal"
        tabindex="-1"
        role="dialog"
        aria-labelledby="myModalLabel"
        aria-hidden="true"
      >
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
              <h4 class="modal-title" id="myModalLabel">{{$t('xinzeng')}}</h4>
            </div>
            <div class="modal-body">
              <form class="form-horizontal" role="form">
                <div class="form-group">
                  <label class="col-sm-2 control-label">
                    {{$t('yonghuming')}}
                    <sqan style="color:red">*</sqan>
                  </label>
                  <div class="col-sm-10">
                    <input
                      type="text"
                      class="form-control"
                      id="user_name"
                      :placeholder="$t('com_qsryhm')"
                      onkeyup="this.value=this.value.replace(/[/\\\/\s//\//]/g,'')"
                    />
                    <input type="hidden" id="user_id" value />
                    <span style="color: brown;"></span>
                  </div>
                </div>
                <div class="form-group">
                  <label class="col-sm-2 control-label">
                    {{$t('use_shoujihaoma')}}
                    <sqan style="color:red">*</sqan>
                  </label>
                  <div class="col-sm-10">
                    <input
                      type="text"
                      class="form-control"
                      id="mobile"
                      maxlength="11"
                      onkeyup="this.value=this.value.replace(/\D/g,'')"
                      onafterpaste="this.value=this.value.replace(/\D/g,'')"
                      :placeholder="$t('qsrsjhm')"
                    />
                    <span style="color: brown;"></span>
                  </div>
                </div>
                <div class="form-group">
                  <label class="col-sm-2 control-label">{{$t('use_youxiang')}}</label>
                  <div class="col-sm-10">
                    <input
                      type="text"
                      class="form-control"
                      id="mail"
                      :placeholder="$t('qsryoux')"
                      onkeyup="this.value=this.value.replace(/[/\\\/\s//\//]/g,'')"
                    />
                    <span style="color: brown;"></span>
                  </div>
                </div>
                <div class="form-group">
                  <label class="col-sm-2 control-label">{{$t('use_xingbie')}}</label>
                  <div class="col-sm-10">
                    <select id="sex" class="form-control">
                      <option value="1">{{$t('use_xb0_nan')}}</option>
                      <option value="0">{{$t('use_xb1_nv')}}</option>
                    </select>
                  </div>
                </div>
                <div class="form-group">
                  <label class="col-sm-2 control-label">
                    {{$t('use_danwei')}}
                    <sqan style="color:red">*</sqan>
                  </label>
                  <div class="col-sm-10">
                    <input
                      type="text"
                      class="form-control"
                      id="company_name"
                      :placeholder="$t('use_qxzdw')"
                      readonly="readonly"
                    />

                    <span style="color: brown;"></span>
                  </div>
                </div>
                <div class="form-group">
                  <label class="col-sm-2 control-label">{{$t('use_jiaosezn')}}</label>
                  <div class="col-sm-10">
                    <select id="jiaose" class="form-control"></select>
                  </div>
                </div>
                <div class="form-group">
                  <label class="col-sm-2 control-label">{{$t('dev_zhuangtai')}}</label>
                  <div class="col-sm-10">
                    <select title id="static" class="form-control">
                      <option value="1">{{$t('com_zt0_kaiqi')}}</option>
                      <option value="0">{{$t('com_zt1_guanbi')}}</option>
                    </select>
                  </div>
                </div>
                <div class="form-group">
                  <label class="col-sm-2 control-label">{{$t('dev_shuoming')}}</label>
                  <div class="col-sm-10">
                    <textarea class="form-control" rows="3"></textarea>
                  </div>
                </div>
              </form>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal">{{$t('guanbi')}}</button>
              <button type="button" class="btn btn-primary" id="addtj">{{$t('baocun')}}</button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<style>
@import "../../../../static/css/ztree/metroStyle.css";
</style>
<style  scoped>
ul.ztree {
  margin-top: 10px;
  border: 1px solid #617775;
  background: #f0f6e4;
  width: 210px;
  height: 360px;
  overflow-y: scroll;
  overflow-x: auto;
}
.ztree {
  margin: 0;
  padding: 5px;
  color: #333;
}
::-webkit-scrollbar {
  width: 6px;
  /*height: 6px;*/
}
/*正常情况下滑块的样式*/
::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.05);
  border-radius: 10px;
  -webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.1);
}
/*鼠标悬浮在该类指向的控件上时滑块的样式*/
:hover::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  -webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.1);
}
/*鼠标悬浮在滑块上时滑块的样式*/
::-webkit-scrollbar-thumb:hover {
  background-color: rgba(0, 0, 0, 0.4);
  -webkit-box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.1);
}
/*正常时候的主干部分*/
::-webkit-scrollbar-track {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
  background-color: white;
}
/*鼠标悬浮在滚动条上的主干部分*/
::-webkit-scrollbar-track:hover {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.4);
  background-color: rgba(0, 0, 0, 0.01);
}
/* @import '../../../../static/css/home/bootstrap.min.css';*/
</style>
<script>
//import loading from '../../../../static/js/Tree/companyTree.js'
//import loadingtow from '../../../../static/js/Tree/companyTreetow.js'
//import Vue from 'vue';
//Vue.use(loading);
import "../../../../static/js/jqgrid/jquery.jqGrid.min.js";
import "../../../../static/js/jqgrid/grid.locale-cn.js";
import "../../../../static/js/page/User/list.js";
import "../../../../static/js/jquery-ui-jqLoding.js";
import loading from "@/views/tree/companylist.vue";
import loadingtow from "@/views/tree/company.vue";
import "../../../../static/js/md5.js";
export default {
  name: "app",
  data() {
    return {
      //selected:"",
      //lgvsRole:"",
      // userinfo:"",
      // selectedsex:"",
      // selectedzt:"",
      // selected: '01',   // 这里选择默认项
    };
  },
  mounted() {
    //console.log(hex_md5("123456").toUpperCase());
    //var self = this;
    // domain.jsonthis=this;
    // var json=[{"user_name":123}];
    // this.userinfo=json;alert(this.userinfo);
    // hex_md5("123456").toUpperCase()fcomponent
    // console.log(json.libraryBooks);
    //self.userinfo=json.libraryBooks;
  },
  methods: {},
  components: {
    loading: loading,
    loadingtow: loadingtow
  }
};
</script>